<template>
  <view class="container">

    
    <!-- 翻译工作台 -->
    <template v-if="identity_type == 11">
      <view class="header" :style="{ paddingTop: statusBarHeight + 'px' }">
        <view class="header-w">
          <view class="left-user-info">
            <view class="avatar-w">
              <view class="avatar">
                <image :src="userInfo.avatar"></image>
              </view>
              <view class="country" v-if="userInfo.label">
                <image :src="ImageUrl(userInfo.label[0].url)" mode="aspectFill"></image>
              </view>
            </view>
            <view class="desc-w">
              <view class="name">{{ userInfo.username }}</view>
              <view class="bottom-tag">
                <view class="tag">
                  <view class="vip-circle">
                    <image src="/static/work/member1.png"></image>
                  </view>
                  <view class="company">{{ userInfo[$t('item.user.identity_name')] }}</view>
                </view>
                <!-- 认证状态 -->
                <view class="renzhen" @click.stop="onGoLand('authTranslate')" v-if="fanyiObj.is_renzheng != 2">
                  
                  {{ ['未认证','审核中','已认证'][fanyiObj.is_renzheng] }}
                 
                </view>
              </view>
            </view>
          </view>
          <view class="right-options translate-set">
            <view class="apply-shop" @click.stop="onGoLand('jiedan')">接单设置({{ fanyiObj.status == 0 ? '暂停接单' : '开始接单' }})</view>
            <view class="apply-shop" @click.stop="onGoLand('authTranslate')">修改资料</view>
          </view>
        </view>
      </view>
      <!-- 采购信息 -->
      <view class="caigou-wrappper">
        <view class="caigou" @click="onGoLand('orderRecord')">
          <view class="name">订单记录</view>
        </view>
        <view class="caigou two" @click="onGoLand('trans-service')">
          <view class="name">发布问询服务</view>
        </view>
      </view>
    </template>


    <!-- 普通工作台 -->
    <template v-else>
      <view class="header" :style="{ paddingTop: statusBarHeight + 'px' }">
        <view class="header-w" @click="personal">
          <view class="left-user-info">
            <view class="avatar-w">
              <view class="avatar">
                <image :src="userInfo.avatar"></image>
              </view>
              <view class="country" v-if="userInfo.label">
                <image :src="ImageUrl(userInfo.label[0].url)" mode="aspectFill"></image>
              </view>
            </view>
            <view class="desc-w">
              <view class="name">{{ userInfo.username }}</view>
              <view class="tag">
                <view class="vip-circle">
                  <image src="/static/work/member1.png"></image>
                </view>
                <view class="company">{{ userInfo[$t('item.user.identity_name')] }}</view>
              </view>
            </view>
          </view>
          <view class="right-options">
            <image src="/static/work/cr.png"></image>
            <view class="apply-shop" @click.stop="isShare = true">申请店铺</view>
          </view>
        </view>
      </view>
      <!-- 采购信息 -->
      <view class="caigou-wrappper">
        <view class="caigou" @click="onGoLand('caigouPublish')">
          <view class="name">发布采购信息</view>
          <view class="desc">一键发布</view>
        </view>
        <view class="caigou two" @click="onGoLand('shipping')">
          <view class="name">我要发货</view>
          <view class="desc">一键发送</view>
        </view>
      </view>
    </template>




    <!-- 订单 -->
    <view class="order-wrapper">
      <view class="list" v-for="(item, index) in lists" :key="index">
        <view class="dt" >{{ item.title }}</view>
        <view class="dd">
          <template  v-for="(icon, index) in item.list" >
            <view class="icon" @click="onGoLand(icon.key)" v-if="identity_type == 11">
              <image :src="icon.icon" />
              <text>{{ icon.title }}</text>
            </view>

            <view class="icon" @click="onGoLand(icon.key)" v-if="identity_type != 11 && (icon.key != 'caigouPublish' &&  icon.key != 'shipping')">
              <image :src="icon.icon" />
              <text>{{ icon.title }}</text>
            </view>
          </template>

        </view>
      </view>
    </view>
    <view style="height: 130rpx;"></view>

    <u-mask :show="isShare" @click="isShare = false">
      <view class="pa flex-column tc copy_wrap" @click.stop>
        <view class="w100p title">
          申请店铺
        </view>
        <view class="w100p con_wrap">
          <view class="w100p xx">
            申请网址为：
          </view>
          <view class="w100p" @click="copyHtml">
            <view class="blue">http://shop.gluz.com.cn/business/#/ <image src="/static/work/fuHi.png"></image>
            </view>
            <view class="txt">推荐你使用Chrome游览器</view>
          </view>
        </view>
        <view class="w100p btn_wrap" @click="isShare = false">
          确定
        </view>
      </view>
    </u-mask>


    <!-- 接单设置 -->
    <u-popup v-model="acceptSet" border-radius="34" mode="bottom">
      <view class="pop-wrapper">
        <view class="headerxx">
          <image src="/static/caigou/chacha.png" @click="onClose" />
        </view>
        <view class="scroll-w">
          <scroll-view scroll-y>
            <view class="lists">
              <view :class="{ list: true, 'active': index == currentIndexJiedan }" v-for="(item, index) in jiedanLists"
                :key="index" @click="onChangeTapJiedan(index)">
                {{ item.title }}
              </view>
            </view>
          </scroll-view>
        </view>

        <view class="btn" @click="confirmJiedan">确定</view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import {
  IMAGE_URL,
} from "@/config/app"
import {
  ImageUrl
} from "@/common/public";


export default {
  data() {
    return {
      isShare: false,
      lang: getApp().globalData.lang,
      statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
      userInfo: {},
      lists: [{
        title: '我的采购',
        list: [{
          title: '采购寻单',
          icon: '/static/work/cai-1.png',
          key: 'caigou',
        }, {
          title: '成交订单',
          icon: '/static/work/cai-3.png',
          key: 'successOrder',
        },{
          title: '发布采购',
          icon: '/static/work/cai-1.png',
          key: 'caigouPublish',
        }, {
          title: '我要发货',
          icon: '/static/work/cai-3.png',
          key: 'shipping',
        }]
      }, {
        title: '信息管理',
        list: [{
          title: '商城订单',
          icon: '/static/work/info-1.png',
          key: 'shopOrder',
        }, {
          title: '购物车',
          icon: '/static/work/info-3.png',
          key: 'cart',
        }]
      }, {
        title: '展会管理',
        list: [{
          title: '展会直播',
          icon: '/static/work/onlin-1.png',
          key: 'ExhibitionAndConference',
        }, {
          title: '展会管理',
          icon: '/static/work/onlin-2.png',
          key: 'ExhibitionAndManage',
        }, {
          title: '展位购买',
          icon: '/static/work/onlin-4.png',
          key: 'ExhibitionLand',
        }]
      }, {
        title: '会员服务',
        list: [{
          title: '询单信息',
          icon: '/static/work/xun-1.png',
          key: 'xundanInfo',
        }, {
          title: '推广统计',
          icon: '/static/work/xun-2.png',
        }]
      }, {
        title: '运输管理',
        list: [{
          title: '发货记录',
          icon: '/static/work/huodai-2.png',
          key: 'fahuojilu',
        }, {
          title: '货物运踪',
          icon: '/static/work/huodai-1.png',
          key: 'yunzong',
        },
          // {
          //         title: '异常反馈',
          //         icon: '/static/work/huodai-3.png',
          //   key: 'fankui',
          //       },
        ]
      }],
      ImageUrl,
      // 接单设置
      acceptSet: false,
      jiedanLists: [{
        title: '开始接单',
        id: 1,
      }, {
        title: '暂停接单',
        id: 0,
      }],
      currentIndexJiedan: 0,
      fanyiObj: {
        is_renzheng: 0, // 0 未认证 1 审核中 2 已成功 
        status: 0, // 0 未接单 1已接单
      },
    }
  },
  props: {
    identity_type: {
      default: '',
    }
  },
  created() {
   
  },
  mounted() {
    this.getUserInfo()
    this.getWork();
    
  },
  methods: {
    // 手动触发数据更新
    getOnShow() {
      this.getUserInfo()
      this.getWork();
    },
    getWork() {

      this.$u.api.basic.state_work({
        user_id: uni.getStorageSync('user_id')
      }).then((res) => {
        this.fanyiObj = res.data;
        this.currentIndexJiedan = res.data.status == 0 ? 1 : 0;
      })
    },
    jegetFun() {
      if (this.fanyiObj.is_renzheng == 0) {
        uni.showToast({
          title: '您还未认证,请去认证',
          icon: 'none',
        })
        setTimeout(() => {
          uni.navigateTo({
            url: '/pages/zWebView/zWebView?url=/pages/translate/authTranslate/index?is_renzheng=' + this.fanyiObj.is_renzheng
          })
        }, 700);

        return;
      }
      if (this.fanyiObj.is_renzheng == 1) {
        uni.showToast({
          title: '您在审核中',
          icon: 'none',
        })
        return;
      }
      return true;
    },
    onJiedanSet() {
      this.acceptSet = true;
    },
    async confirmJiedan() {
      try {
        let res = await this.$u.api.basic.staff_set_status({
          user_id: uni.getStorageSync('user_id'),
          status: this.jiedanLists[this.currentIndexJiedan].id,
        })

        uni.showToast({
          title: res.status == 0 ? '暂停成功' : '开启成功',
        })
        setTimeout(() => {
          this.getWork();
        }, 700);
  
        console.log(res,'xxxxxx')
      } catch (error) {
        console.log(error,'错误')
      }
      this.acceptSet = false;
    },
    onClose() {
      this.acceptSet = false;
    },
    // 接单
    onChangeTapJiedan(index) {
      this.currentIndexJiedan = index;
    },
    copyHtml() {
      uni.setClipboardData({
        data: 'http://shop.gluz.com.cn/business/#/',
        success: () => {
          uni.showToast({
            title: '复制成功',
            icon: 'none',
          })
        }
      })
    },
    //个人资料跳转
    personal() {
      var that = this
      this.$u.api.user.is_user().then(r => {
        if (r) {
          //判断当前用户角色 决定跳转位置
          const identity_type = uni.getStorageSync("identity_type")
          let url = "pages/user/personal/personal"
          if ([2, 5, 6, 7].indexOf(Number(identity_type)) > -1) url =
            "pages/tabbar/order/card/cardIndex"
          that.$u.route({
            url,
            // url: 'pages/tabbar/order/ImproveInformation',
            params: {
              // id: this.userInfo.user_id
              // model: JSON.stringify(this.model)
            }
          })
        } else {
          that.$u.toast(that.$t('请先登录'));
          setTimeout(() => {
            // 此为uView的方法，详见路由相关文档
            that.$u.route('/pages/user/login/login')
          }, 1000)
        }
      })
    },
    // 获取数据
    async getUserInfo() {
      var userinfo = "";
      const that = this;
      const {
        deviceBrand,
        deviceModel,
        deviceId,
        osName,
        osVersion
      } = uni.getSystemInfoSync();
      userinfo = deviceBrand + ',' + deviceModel + ',' + deviceId + ',' + osName + ',' + osVersion
      let user = await that.$u.api.user.getUserInfo({
        userinfo: userinfo
      });
      this.userInfoFull = user;
      uni.setStorageSync("userInfoFull", user)

      this.userInfo = user
      this.userInfo.avatar = IMAGE_URL + this.userInfo.avatar

      this.loading = true

    },
    onGoLand(jmpKey) {
      switch (jmpKey) {
        case 'ExhibitionAndManage': // 展会管理
          uni.navigateTo({
            url: '/pages/zWebViewOline/zWebViewOline?url=/pages/EventManagement/index',
          })
          break;
        case 'ExhibitionLand': // 地块购买
          uni.navigateTo({
            url: '/pages/zWebViewOline/zWebViewOline?url=/pages/online/index',
          })
          break;
        case 'ExhibitionAndConference':
          // uni.navigateTo({
          //   url: '/pages/EventManagementDetail/index', // 展会直播
          // })
          uni.showToast({
            title: '直播等待原生app开通，请耐心等待',
            icon: 'none',
          })
          break;

        case 'shipping':  //发货
          uni.navigateTo({
            url: '/pages/zWebView/zWebView?url=/pages/publish/start',
          })
          break;
        case 'online':  // 跳入线上展会
          uni.navigateTo({
            url: '/pages/zWebViewOline/zWebViewOline',
          })
          break;
        case 'caigou':  // 采购寻单
          uni.navigateTo({
            url: '/pages/zWebViewShop/zWebViewShop?url=/pages/caigou/index/index',
          })
          break;
        case 'caigouPublish':  // 采购寻单
          uni.navigateTo({
            url: '/pages/zWebViewShop/zWebViewShop?url=/pages/caigou/publishInfo/index',
          })
          break;
        case 'fahuojilu':  // 发货记录
          uni.navigateTo({
            url: '/pages/zWebView/zWebView?url=/pages/shipmentRecord/index',
          })
          break;
        case 'yunzong':  // 货物运踪
          uni.navigateTo({
            url: '/pages/zWebView/zWebView?url=/pages/shipmentRecord/index?status=3'
          })
          break;
        case 'successOrder':  // 成交订单
          uni.navigateTo({
            url: '/pages/zWebViewShop/zWebViewShop?url=/pages/caigou/order/index'
          })
          break;
        case 'shopOrder':  // 商城订单
          uni.navigateTo({
            url: '/pages/zWebView/zWebView?url=/pages/shipmentRecord/index'
          })
          break;
        case 'xundanInfo':  // 询单信息
          uni.navigateTo({
            url: '/pages/zWebViewShop/zWebViewShop?url=/pages/caigou/searchInformation/index'
          })
          break;
        case 'cart':  // 购物车
          uni.navigateTo({
            url: '/pages/zWebViewShop/zWebViewShop?url=/pages/caigou/shopCart/index'
          })
          break;

        // 发布问询
        case 'trans-service':
          if (this.jegetFun()) {
            uni.navigateTo({
              url: '/pages/zWebView/zWebView?url=/pages/translate/publishService/index'
            })
          }

          break;

        // 翻译认证
        case 'authTranslate':
          if (this.jegetFun()) {
            uni.navigateTo({
              url: '/pages/zWebView/zWebView?url=/pages/translate/authTranslate/index?is_renzheng=' + this.fanyiObj.is_renzheng
            })

          }

          break;

        case 'orderRecord': // 订单记录
          if (this.jegetFun()) {
            uni.navigateTo({
              url: '/pages/zWebView/zWebView?url=/pages/translate/orderList/index'
            })
          }

          break;

        case 'jiedan': // 接单
          if (this.jegetFun()) {
            this.onJiedanSet();
          }
          break;











      }
    }
  },
}






</script>


<style lang="scss" scoped>
.container {
  background-color: #F6F7FB;
  width: 100%;

  .header {
    background: url('/static/work/header-bg.png') no-repeat;
    background-size: 100% auto;
    height: 596rpx;
    box-sizing: content-box;

    .header-w {
      padding: 24rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-left: 30rpx;

      .left-user-info {
        display: flex;

        .avatar-w {
          margin-right: 22rpx;
          position: relative;
          height: 100rpx;

          .avatar {
            width: 98rpx;
            height: 98rpx;
            padding: 2rpx;
            background: #fff;
            border-radius: 18rpx;
            overflow: hidden;
            transform: rotate(-15deg);
            position: relative;
            top: 10rpx;

            image {
              width: 100%;
              height: 100%;
              border-radius: 18rpx;
            }
          }

          .country {
            box-sizing: border-box;
            padding: 2rpx;
            background: #fff;
            border-radius: 8rpx;
            display: inline-block;
            position: absolute;
            bottom: -28rpx;
            left: 10rpx;

            image {
              border-radius: 8rpx;
              width: 86rpx;
              height: 36rpx;
              display: block;
            }
          }
        }

        .desc-w {
          padding-top: 6rpx;

          .name {
            color: #1D1D1D;
            font-size: 34rpx;
            font-weight: 600;
            margin-bottom: 16rpx;
          }

          .bottom-tag {
            display: flex;
            align-items: center;

            // 未认证
            .renzhen {
              color: #EE1C25;
              font-size: 24rpx;
              font-weight: 400;
              text-decoration: underline;
              margin-left: 20rpx;
            }
          }


          .tag {
            display: inline-flex;
            align-items: center;
            height: 50rpx;
            border-radius: 25rpx;
            background: linear-gradient(270deg, #FFFEFD -1.7%, #FFD392 99.89%);
            box-shadow: 1rpx 1rpx 4.4rpx 0px rgba(63, 137, 222, 0.55);
            padding-right: 16rpx;

            .vip-circle {
              width: 46rpx;
              height: 46rpx;
              border-radius: 50%;
              display: flex;
              align-items: center;
              justify-content: center;
              box-shadow: 0 0 5rpx 0 #999;
              margin-right: 14rpx;

              image {
                width: 30rpx;
                height: 30rpx;
              }
            }

            .company {
              color: #5D3800;
              font-size: 24rpx;
              font-weight: 500;
            }
          }
        }
      }

      .right-options {
        text-align: right;

        &.translate-set {
          .apply-shop {
            &:first-child {
              margin-bottom: 28rpx;
            }
          }
        }

        image {
          width: 50rpx;
          height: 42rpx;
          margin-bottom: 28rpx;
        }

        .apply-shop {
          color: #0039A6;
          font-size: 24rpx;
          text-decoration: underline;
        }
      }
    }
  }

  .caigou-wrappper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24rpx;
    margin-bottom: 24rpx;
    position: relative;
    margin-top: -420rpx;

    .caigou {
      width: 338rpx;
      height: 135rpx;
      background: url('/static/work/left1.png') no-repeat;
      background-size: 100% 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;

      &.two {
        background: url('/static/work/left2.png') no-repeat;
        background-size: 100% 100%;

        .name {
          color: #007AFF;
        }
      }

      .name {
        color: #FF6A00;
        font-size: 32rpx;
        font-weight: 500;
        margin-bottom: 10rpx;
        padding-left: 22rpx;
      }

      .desc {
        color: #B6B6B6;
        font-size: 22rpx;
        line-height: 24rpx;
        padding-left: 22rpx;
      }
    }
  }

  // 订单
  .order-wrapper {
    margin: 0 24rpx;
    background: linear-gradient(to bottom, #DDEDFB 0%, #EFF5FB 20%, #F9FCFE);
    padding-top: 35rpx;
    border-radius: 18rpx;
    padding-bottom: 35rpx;
    position: relative;

    .list {
      margin-bottom: 46rpx;

      .dt {
        color: #000;
        font-size: 26rpx;
        font-weight: 600;
        padding-bottom: 40rpx;
        padding-left: 30rpx;
        padding-right: 30rpx;
      }

      .dd {
        display: flex;

        .icon {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          width: 25%;

          image {
            width: 70rpx;
            height: 70rpx;
            margin-bottom: 16rpx;
          }

          text {
            color: #333;
            text-align: center;
            font-size: 26rpx;
          }
        }

      }
    }
  }
}

.container {
  .copy_wrap {
    width: 702rpx;
    height: 492rpx;
    background-color: #fff;
    border-radius: 12rpx;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    padding: 40rpx 40rpx 24rpx 40rpx;
    justify-content: space-between;
    line-height: 1.2;

    image {
      width: 38rpx;
      height: 38rpx;
    }

    .title {
      font-size: 32rpx;
      color: #262728;
      font-weight: 600;
    }

    .con_wrap {
      font-size: 28rpx;
      color: #1D2129;
      text-align: left;

      .xx {
        margin-bottom: 30rpx;
      }

    }

    .btn_wrap {
      font-size: 28rpx;
      color: #fff;
      background: #007AFF;
      border-radius: 12rpx;
      height: 80rpx;
      line-height: 80rpx;
    }

    .blue {
      display: flex;
      align-items: center;
      font-weight: 600;
      width: 100%;
      color: #007AFF;

      image {
        margin-left: 13rpx;
      }
    }

    .txt {
      margin-top: 8rpx;
    }
  }

  .pa {
    position: absolute;
  }

  .tc {
    text-align: center;
  }

  .w100p {
    width: 100%;
  }

  .flex-column {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}


// 接单设置
.pop-wrapper {
  border-top-left-radius: 24rpx;
  border-top-right-radius: 24rpx;

  .headerxx {
    height: 110rpx;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 44rpx;

    image {
      width: 26rpx;
      height: 26rpx;
    }
  }

  .scroll-w {
    scroll-view {
      max-height: 48vh;
    }
  }

  // 列表
  .lists {
    padding: 0 48rpx;

    .list {
      height: 94rpx;
      border-radius: 18rpx;
      border: 1px solid #F0F0F0;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #333;
      font-size: 32rpx;
      font-weight: 400;
      margin-bottom: 24rpx;

      &.active {
        border: 1px solid #278AFF;
        background: #278AFF;
        color: #fff;
      }
    }
  }


  .btn {
    height: 94rpx;
    border-radius: 18rpx;
    background: #007AFF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-size: 30rpx;
    font-weight: 600;
    margin: 20rpx 24rpx;
  }

}
</style>
